// 把盒子变为弹性盒模型，并且盒内子节点 水平垂直剧中。
// 参数1，principalSxis：主轴方向，
// 参数2，CrossAxi：交叉轴的排列形式
@mixin innerCenter($principalSxis: row, $crossAxis: center) {
  display: flex;
  flex-direction: $principalSxis;
  justify-content: center;
  align-items: $crossAxis;
}

// 相对距离自己最近且有定位的父级居中
// 参数1, 取值0，表示垂直方向不居中。取值 50%，垂直方向居中
@mixin selfCenter($verticality: 50%, $poi: absolute) {
  position: absolute;
  left: 50%;

  @if $verticality==50% {
    top: $verticality;
    transform: translate(-50%, -50%);
  }

  @else {
    transform: translateX(-50%);
  }

}

// 单行文本溢出省略号
@mixin textEllipsis() {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

// 多行
@mixin textEllipsisMore($row: 1) {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  text-overflow: ellipsis;
  -webkit-line-clamp: $row;
  overflow: hidden;
}